.container
  display: flex
  flex-direction: row
  justify-content: space-between
  height: 100%

  > *
    background-color: white
    border-radius: 16px

  .roleContainer
    display: flex
    flex-direction: column
    min-width: 28%
    padding: 24px 16px
    margin-right: 24px

    .roleItem
      display: flex
      justify-content: space-between
      width: 100%
      padding: 8px 0
      cursor: pointer

  .authorityTreeContainer
    flex-grow: 1
    padding: 24px 16px
    display: flex
    justify-content: space-between
    flex-direction: column
    overflow-y: auto
    .selectedRoleName
      font-size: 20px
      font-weight: bold
      margin-bottom: 16px
    .authorityTree
      flex-grow: 1

    .button
      align-self: end
      margin-top: 16px

  .authorityTreeContainerEmpty
    display: flex
    justify-content: center
    align-items: center
    flex-grow: 1


